tests: Fix scrolling in border.js and border-radius.js

In both tests the scrolled actor's width was fixed to the stage
width, so that the scroll bars ended up outside the visible area.

Fix by adding an outer container with a fixed width and expanding
the scroll view to fill the available area.

diff --git a/tests/interactive/border-radius.js b/tests/interactive/border-radius.js
index 3d5314cd543c403bb3ccc38d1b2780fa79a60c6e..670eaf0045d00f90f562d4cf611eda83016e2a9e 100644 (file)
--- a/tests/interactive/border-radius.js
+++ b/tests/interactive/border-radius.js
@@ -10,15 +10,18 @@ let stage = Clutter.Stage.get_default();
 stage.width = 640;
 stage.height = 480;
 
-let vbox = new St.BoxLayout({ vertical: true,
-                              width: stage.width,
+let vbox = new St.BoxLayout({ width: stage.width,
                               height: stage.height,
-                              style: 'padding: 10px;'
-                                     + 'spacing: 20px;'
-                                     + 'background: #ffee88;' });
+                              style: 'background: #ffee88;' });
+stage.add_actor(vbox);
+
 let scroll = new St.ScrollView();
-scroll.add_actor(vbox);
-stage.add_actor(scroll);
+vbox.add(scroll, { expand: true });
+
+let box = new St.BoxLayout({ vertical: true,
+                             style: 'padding: 10px;'
+                                    + 'spacing: 20px;' });
+scroll.add_actor(box);
 
 function addTestCase(radii, useGradient) {
     let background;
@@ -29,11 +32,11 @@ function addTestCase(radii, useGradient) {
     else
         background = 'background: white;';
 
-    vbox.add(new St.Label({ text: "border-radius:  " + radii + ";",
-                            style: 'border: 1px solid black; '
-                                   + 'border-radius: ' + radii + ';'
-                                   + 'padding: 5px;' + background }),
-                          { x_fill: false });
+    box.add(new St.Label({ text: "border-radius:  " + radii + ";",
+                           style: 'border: 1px solid black; '
+                                  + 'border-radius: ' + radii + ';'
+                                  + 'padding: 5px;' + background }),
+                         { x_fill: false });
 }
 
 // uniform backgrounds

diff --git a/tests/interactive/borders.js b/tests/interactive/borders.js
index 66ee1886a0bc70549b709a86ef83c610cdc94b2f..7c5cda13a403ed1a622e90a2e71231e5f112d99c 100644 (file)
--- a/tests/interactive/borders.js
+++ b/tests/interactive/borders.js
@@ -10,63 +10,66 @@ let stage = Clutter.Stage.get_default();
 stage.width = 640;
 stage.height = 480;
 
-let vbox = new St.BoxLayout({ vertical: true,
-                              width: stage.width,
+let vbox = new St.BoxLayout({ width: stage.width,
                               height: stage.height,
-                              style: 'padding: 10px;'
-                                     + 'spacing: 20px;'
-                                     + 'background: #ffee88;' });
+                              style: 'background: #ffee88;' });
+stage.add_actor(vbox);
+
 let scroll = new St.ScrollView();
-scroll.add_actor(vbox);
-stage.add_actor(scroll);
+vbox.add(scroll, { expand: true });
+
+let box = new St.BoxLayout({ vertical: true,
+                             style: 'padding: 10px;'
+                                    + 'spacing: 20px;' });
+scroll.add_actor(box);
+
+box.add(new St.Label({ text: "Hello World",
+                       style: 'border: 1px solid black; '
+                              + 'padding: 5px;' }));
 
-vbox.add(new St.Label({ text: "Hello World",
-                        style: 'border: 1px solid black; '
-                               + 'padding: 5px;' }));
+box.add(new St.Label({ text: "Hello Round World",
+                       style: 'border: 3px solid green; '
+                              + 'border-radius: 8px; '
+                              + 'padding: 5px;' }));
 
-vbox.add(new St.Label({ text: "Hello Round World",
-                        style: 'border: 3px solid green; '
-                               + 'border-radius: 8px; '
-                               + 'padding: 5px;' }));
+box.add(new St.Label({ text: "Hello Background",
+                       style: 'border: 3px solid green; '
+                              + 'border-radius: 8px; '
+                              + 'background: white; '
+                              + 'padding: 5px;' }));
 
-vbox.add(new St.Label({ text: "Hello Background",
-                        style: 'border: 3px solid green; '
-                               + 'border-radius: 8px; '
-                               + 'background: white; '
-                               + 'padding: 5px;' }));
+box.add(new St.Label({ text: "Hello Translucent Black Border",
+                       style: 'border: 3px solid rgba(0, 0, 0, 0.4); '
+                              + 'background: white; ' }));
 
-vbox.add(new St.Label({ text: "Hello Translucent Black Border",
-                        style: 'border: 3px solid rgba(0, 0, 0, 0.4); '
-                               + 'background: white; ' }));
-                               
-vbox.add(new St.Label({ text: "Hello Translucent Background",
-                        style: 'background: rgba(255, 255, 255, 0.3);' }));
+box.add(new St.Label({ text: "Hello Translucent Background",
+                       style: 'background: rgba(255, 255, 255, 0.3);' }));
 
-vbox.add(new St.Label({ text: "Border, Padding, Content: 20px" }));
+box.add(new St.Label({ text: "Border, Padding, Content: 20px" }));
 
 let b1 = new St.BoxLayout({ vertical: true,
                             style: 'border: 20px solid black; '
                                    + 'background: white; '
                                    + 'padding: 20px;' });
-vbox.add(b1);
+box.add(b1);
 
 b1.add(new St.BoxLayout({ width: 20, height: 20,
                           style: 'background: black' }));
 
-vbox.add(new St.Label({ text: "Translucent big blue border, with rounding",
-                        style: 'border: 20px solid rgba(0, 0, 255, 0.2); '
-                               + 'border-radius: 10px; '
-                               + 'background: white; '
-                               + 'padding: 10px;' }));
+box.add(new St.Label({ text: "Translucent big blue border, with rounding",
+                       style: 'border: 20px solid rgba(0, 0, 255, 0.2); '
+                              + 'border-radius: 10px; '
+                              + 'background: white; '
+                              + 'padding: 10px;' }));
 
-vbox.add(new St.Label({ text: "Transparent border",
-                        style: 'border: 20px solid transparent; '
-                               + 'background: white; '
-                               + 'padding: 10px;' }));
+box.add(new St.Label({ text: "Transparent border",
+                       style: 'border: 20px solid transparent; '
+                              + 'background: white; '
+                              + 'padding: 10px;' }));
 
-vbox.add(new St.Label({ text: "Border Image",
-                        style_class: "border-image",
-                        style: "padding: 10px;" }));
+box.add(new St.Label({ text: "Border Image",
+                       style_class: "border-image",
+                       style: "padding: 10px;" }));
 
 stage.show();
 Clutter.main();